<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1">
<base href="http://localhost:8080/jxc/" />
<link rel="stylesheet" href="layui/css/layui.css">
<link rel="stylesheet" href="admin/view.css" />
<link rel="icon" href="/favicon.ico">
<title>进销存管理后台</title>
</head>
<body class="layui-view-body">
	<div class="layui-content">
		<div class="layui-page-header">
			<div class="pagewrap">
				<h2 class="title">进货信息</h2>
			</div>
		</div>
		<div class="layui-row">
			<div class="layui-card">
				<div class="layui-card-body">
					<div class="form-box">
						<div class="layui-form layui-form-item">
							<div class="layui-inline">
								<div class="layui-form-mid">货单号:</div>
								<div class="layui-input-inline" style="width: 100px;">
									<input type="text" autocomplete="off" class="layui-input" id="qpurchaseid"/>
								</div>
								<div class="layui-form-mid">进货人:</div>
								<div class="layui-input-inline" style="width: 100px;">
									<select name="qemployeecode" id="qemployeecode">
									</select>
								</div>
								<div class="layui-form-mid">厂商:</div>
								<div class="layui-input-inline" style="width: 100px;">
									<select name="qcompanyid" id="qcompanyid">
									</select>
								</div>
								<div class="layui-form-mid">商品:</div>
								<div class="layui-input-inline" style="width: 100px;">
									<select name="qgoodsid" id="qgoodsid">
									</select>
								</div>
								<div class="layui-form-mid">转态:</div>
								<div class="layui-input-inline" style="width: 100px;">
									<select name="qpurchasestatu" id="qpurchasestatu">
										<option value='' checked>请选择</option>
										<option value='否' >待入库</option>
										<option value='是' >已入库</option>
									</select>
								</div>
						    </div>
						    <div class="layui-inline">
								<div class="layui-form-mid">开始日期:</div>
								<div class="layui-input-inline" style="width: 100px;">
									<input type="text" autocomplete="off" class="layui-input" id="starttime"/>
								</div>
								<div class="layui-form-mid">结束日期:</div>
								<div class="layui-input-inline" style="width: 100px;">
									<input type="text" autocomplete="off" class="layui-input" id="endtime"/>
								</div>
								<button class="layui-btn layui-btn-blue" id="query" data-type="reload">查询</button>
								<button class="layui-btn layui-btn-primary" id="reset">重置</button>
								<button class="layui-btn layui-btn-blue" id="addgoods">
										<i class="layui-icon">&#xe654;</i>新增
								</button>
							</div>
						</div>
						<table id="table" lay-filter="tableTool"></table>
					</div>
				</div>
			</div>
		</div>
	</div>
	<!-- 	弹出框 -->
	<div id="content" style="display: none">
		<form id="updatepurchase">
			<table id="data" class="editorTable"
				style="margin: auto; margin-top: 50px; width: 80%;">
				<tr class="layui-form-item">
					<th class="layui-form-label">进货编号</th>
					<td><input type="text" readonly="true" id="purchaseid" name="purchaseid" class="layui-input-inline"/></td>
				</tr>

				<tr class="layui-form-item">
					<th class="layui-form-label">进货价格</th>
					<td><input type="text" id="purchaseprice" name="purchaseprice"
						class="layui-input-inline" /></td>
				</tr>

				<tr class="layui-form-item">
					<th class="layui-form-label">进货数量</th>
					<td><input type="text" id="purchasenum"
						name="purchasenum" class="layui-input-inline" /></td>
				</tr>
				<tr class="layui-form-item" id="purchasesum1">
					<th class="layui-form-label">总价</th>
					<td><input type="text" id="purchasesum" name="purchasesum"
						class="layui-input-inline" /></td>
				</tr>
				<tr class="layui-form-item">
					<th class="layui-form-label">进货处理人</th>
					<td><div class="layui-input-inline" style="width: 100px;">
									<select name="employeecode" id="employeecode">
									</select>
								</div></td>
				</tr>
				<tr class="layui-form-item">
					<th class="layui-form-label">进货公司</th>
					<td><div class="layui-input-inline" style="width: 100px;">
									<select name="companyid" id="companyid">
									</select>
								</div></td>
				</tr>
				<tr class="layui-form-item">
					<th class="layui-form-label">商品名</th>
					<td><div class="layui-input-inline" style="width: 100px;">
									<select name="goodsid" id="goodsid">
									</select>
								</div></td>
				</tr>
			</table>
		</form>
	</div>
	<script src="layui/layui.js"></script>
	<script>
		layui.use([ 'element', 'table', 'form', 'layer', 'jquery', 'laydate'], function(
				element, table, form, layer, $,laydate) {
			
			//表头查询、添加预、修改准备数据,
			//进货人
			var $qemployee=$("#qemployeecode");//查询
			var $aemployee=$("#employeecode");//添加
			$qemployee.append("<option value='' checked>请选择</option>");
			$aemployee.append("<option value='' checked>请选择</option>");
			$.get("employee/findallemployee",function(data){
						var str = "";
          				for(i in data){
          					str = "<option value='"+data[i].employeecode+"'>"+data[i].employeename+"</option>";     
          					$qemployee.append(str);
          					$aemployee.append(str);
          					form.render('select');
          				}
				},'json');
			
			//厂商
			var $qcompany=$("#qcompanyid");//查询
			var $acompany=$("#companyid");//添加
			$qcompany.append("<option value='' checked>请选择</option>");
			$acompany.append("<option value='' checked>请选择</option>");
			$.get("company/findallcompany",function(data){
						var str = "";
          				for(i in data){
          					str = "<option value='"+data[i].companyid+"'>"+data[i].companyname+"</option>";     
          					$qcompany.append(str);
          					$acompany.append(str);
          					form.render('select');
          				}
				},'json');
			
			//商品
			var $qgoods=$("#qgoodsid");//查询
			var $agoods=$("#goodsid");//添加
			$qgoods.append("<option value='' checked>请选择</option>");
			$agoods.append("<option value='' checked>请选择</option>");
			$.get("goods/findallgoods",function(data){
						var str = "";
          				for(i in data){
          					str = "<option value='"+data[i].goodsid+"'>"+data[i].goodsname+"</option>";     
          					$qgoods.append(str);
          					$agoods.append(str);
          					form.render('select');
          				}
				},'json');
			
			//日期
			laydate.render({
  					elem: '#starttime'//指定元素				
					});
			
			//日期
			laydate.render({
  					elem: '#endtime'//指定元素		
					});
			
			//展示已知数据
			table.render({
				elem : '#table',
				method : 'post',
				url : 'purchase/findpurchasedynamic',
				cellMinWidth : 80,
				cols : [ [ {
					field : 'purchaseid',
					title : '进货编号',
					sort : true
				}, {
					field : 'purchaseprice',
					title : '进货价格'
				}, {
					field : 'purchasenum',
					title : '数量'
				},{
					field : 'purchasesum',
					title : '总价'
				},{
					field : 'purchasedate',
					title : '进货时间'
				},{
					field : 'employeename',
					title : '进货处理人'
				},{
					field : 'companyname',
					title : '进货厂商'
				},{
					field : 'goodsname',
					title : '商品名'
				},{
					field : 'purchasestatu',
					title : '是否入库'
				},{
					field : 'right',
					title : '操作',
					toolbar : '#barDemo',
					width : 160
				} ] ],
				id : 'testReload',
				where:{
					"purchaseid" : '',
					"employeecode": '',	
					"companyid" : '',
					"goodsid": '',	
					"starttime" : '1981-01-01',
					"endtime": '2029-12-30',
					"purchasestatu" : ''
				},
				skin : 'line' //表格风格
				,
				even : true,
				page : true //是否显示分页
				,
				limits : [ 5, 7, 10 ],
				limit : 5
			//每页默认显示的数量
			});

			//监听工具条
			table.on('tool(tableTool)', function(obj) { //注：tool是工具条事件名，tableTool是table原始容器的属性 lay-filter="对应的值"
				var data = obj.data; //获得当前行数据
				var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
				var tr = obj.tr; //获得当前行 tr 的DOM对象

				if (layEvent === 'detail') { //入库
					layer.msg('ID：' + data.purchaseid + '的入库操做');
				} else if (layEvent === 'del') { //删除
					//console.log("删除");
					layer.confirm('确认删除' + data.purchaseid + '号进货单？',
							function(index) {
								//do something
								$.ajax({
									type : "post",
									url : "purchase/deletepurchase",
									dataType : 'json',
									data : "purchaseid=" + data.purchaseid,
									success : function(data) {//成功返回1
										if (data == 1) {
											obj.del(); //删除对应行（tr）的DOM结构，并更新缓存
											layer.close(index);
											layer.msg('成功删除');
										} else {
											layer.msg('删除失败');
										}
									},
									error : function() {
										layer.msg('操作失败');
									}
								});
							});
				} else if (layEvent === 'edit') { //编辑
					$("#purchaseid").val(data.purchaseid);
					$("#purchaseprice").val(data.purchaseprice);
					$("#purchasenum").val(data.purchasenum);
					$("#purchasesum").val(data.purchasesum);
					$("#employeecode").find("option[value = '" + data.employee.employeecode + "']").attr("selected", "selected");	
					$("#companyid").find("option[value = '" + data.companys.companyid + "']").attr("selected", "selected");
					$("#goodsid").find("option[value = '" + data.goods2.goodsid + "']").attr("selected", "selected");
					//do something
					layer.open({
						type : 1,
						title : "编辑进货单",
						btn : [ '确定', '取消' ],//yes->添加==btn1->添加,btn2类推对应数组
						area : [ '450px', '450px' ],
						content : $("#content"),
						anim : 3,
						success : function() {
						},
						yes : function() {
							$.ajax({
								url : 'purchase/updatepurchase',
								type : 'post',
								dataType : 'text',
								data : $("#updatepurchase").serialize(),
								success : function(data) {
									if (data == 1) {
										layer.msg('修改成功');
										location.reload();
									} else {
										layer.msg('修改失败');
									}
								}
							});
						},
						end: function() {//无论是确认还是取消，只要层被销毁了，end都会执行
// 							$("#categoryname").find("option[value = '" + data.category.categoryid + "']").removeAttr("selected");
// 							$("#categoryname").find("option[value = '" + data.category.categoryid + "']")
// 							.attr("selected", "");
						}
					});
				}

			});
			
	//顶部查询，有table.reload方法，但mybatis需写动态查询	
    //顶部查询，table.reload方法
	var active = {
    	reload: function(){
//       		var demoReload = $('#demoReload');//为了取input的值
          		//执行重载
      		table.reload('testReload', {//testReload:第一次加载table.render中指定的id
        			page: {
          				curr: 1 //重新从第 1 页开始
        					}
        			,where: {
        				
        				"purchaseid" : $("#qpurchaseid").val(),
    					"employeecode": $("#qemployeecode").val(),	
    					"companyid" : $("#qcompanyid").val(),
    					"goodsid": $("#qgoodsid").val(),	
    					"starttime" : $("#starttime").val(),
    					"endtime": $("#endtime").val(),
    					"purchasestatu" : $("#qpurchasestatu").val()
        		}
      }, 'data');
    }
	}		
	$("#query").on('click', function(){
	    var type = $(this).data('type');
	    active[type] ? active[type].call(this) : '';
	  });
			
			//顶部新增
			$("#addgoods").click(function() {
				$("#data tr:first").css("display","none");
				$("#purchasesum1").css("display","none");
// 				$("#companyid").removeAttr("readonly");
				layer.open({
					type : 1,
					title : "添加进货单",
					btn : [ '确定', '取消' ],//yes->添加==btn1->添加,btn2类推对应数组
					area : [ '450px', '450px' ],
					content : $("#content"),
					anim : 3,
					success : function() {
						$("#data input[type='text'],input[type='password']").val("");	
						$("select").find("option[value = '']").attr("selected", "selected");
					},
					yes : function() {
						$.ajax({
							url : 'purchase/insertpurchase',
							type : 'post',
							dataType : 'text',
							data : $("#updatepurchase").serialize(),
							success : function(data) {
								if (data == 1) {
									layer.msg('添加成功');
									location.reload();
								} else {
									layer.msg('添加失败');
								}
							}
						});
						//display=none
					},
					end: function() {//无论是确认还是取消，只要层被销毁了，end都会执行
// 						$("#companyid").attr("readonly","true");
						$("#data tr:first").css("display","");
						$("#purchasesum1").css("display","");
					}
				});
			});
		});
	</script>
	<!-- tools -->
	<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">入库</a>
    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
	</script>
</body>
</html>